<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/include/taglibs.jsp" %>
<%@ page import="com.depo.quiggle.view.controller.JobEditAction" %>
<%@ page import="com.depo.quiggle.view.controller.RegisterAction" %>
<%@ page import="com.depo.quiggle.view.controller.QglLogDetailAccountingAction" %>
<%@ page import="com.depo.quiggle.view.controller.QglLogPendingAction" %>
<%@ page import="com.depo.quiggle.view.controller.QglLogPendingTurnedInAction" %>
<%@ page import="com.depo.quiggle.view.controller.QglLogDetailAction" %>
<script type="text/javascript">

currentAction = 8;
currentAction1 = 8;
 
function callAjaxToCalculatePaymentAferJobSaving(jobId){
 

	 $.ajaxSetup({
		   jsonp: null,
		   jsonpCallback: null
		});

	    $.ajax({
		  type:'POST',
		  url: 'qgl-log-detail-accounting.action?calculatePaymentForAJob',//name of action?name of method in action
		  dataType: 'json',
		  data: {jobId:jobId},
			 
		  success: function(result){
			   
			if(result!=null){
				
				$("#receivableAmount"+jobId).html("$"+result.receivableAmount.toFixed(2));
				//$("#receivableAmount"+jobId).prev().text(result.receivableAmount);
								
				$("#payableAmount"+jobId).html("$"+result.payableAmount.toFixed(2));
				//$("#payableAmount"+jobId).prev().text(result.payableAmount);
								
				$("#prooferPayable"+jobId).html("$"+result.prooferPayable.toFixed(2));
				//$("#prooferPayable"+jobId).prev().text(result.prooferPayable);
				
				$("#scopistPayable"+jobId).html("$"+result.scopistPayable.toFixed(2));
				//$("#scopistPayable"+jobId).prev().text(result.scopistPayable);
				
				$("#netAmount"+jobId).html("$"+result.netAmount.toFixed(2));
				//$("#netAmount"+jobId).prev().text(result.netAmount);
			}
     
		 },
		  error:function() { 
			  
		  }
	});
}

 
</script>
<div class="infoBut" style="z-index: 99;"><a href="#" id="infoButton"><img src="images/infoicon.png"  alt="Information" border="0" /></a></div>
<div class="dashboard-content">
<!-- Begin Instruction -->
 <div class="instructions" id="instructions">
    <h3 class='qgl'><span class="fright" id="instrutionsSpanForQGL">
					<a href="javascript:{}" title="click here to hide the instructions" id="instructionsHideLinkForQGL" style="background:#E3F2FF;">
						<img  id="instructionsDownarrowimg" src="images/uparrow.png" width="10" height="9" alt="Hide" />
					</a>
				</span>Quick Glance Log</h3>
            	<div id="contentInsForQGL"><strong>At a glance determine:</strong>
<OL>
  <li>How many hours you have to set aside from your life and work to scope, proof and perform administrative tasks (i.e., caption, index and worksheet completion)</li>
<li>Which job is due and when</li>
<li>	Balance outstanding </li>
</OL>
</div>
            
            </div>
<!-- End Instruction -->
    <div class="qgl-pending-list">
<div id="rateTableForm" title="Rate Table">
</div>
	<fmt:setBundle basename="help" var="help"/>
        <div id="agency-form" title="Create New A/R" style="display:none;">
		<div id="agency-form-ErrorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <form action="#">
                <fieldset>
                    <div >
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="agency-initial" >Initial</label>
                        <input type="text" name="name" maxlength="10"  id="agency-initial" style="margin-left: 4px;" class="initial text ui-widget-content ui-corner-all" />
                    </div>
                    <div class="p-5" style="padding:5px 0px 0px;">
                        <label for="agency-name">Name</label>
                        <input type="text" name="email" maxlength="50" id="agency-name" class="text ui-widget-content ui-corner-all t-tip"  
						title="<fmt:message bundle='${help}' key='help.qgl.CREATE_NEW_AGENCY_NAME'/>"/>
                    </div>
                </fieldset>
                 <p style="display:none"> Agency already exists</p>
            </form>
        </div>
        <div id="scopist-form" title="Create New Scopist"  style="display:none;">
		<div id="scopist-form-ErrorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <form action="#">
                <fieldset>
                    <div >
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="scopist-initial">Initial</label>
                        <input type="text" name="name" maxlength="10" id="scopist-initial" class="initial text ui-widget-content ui-corner-all" style="margin-left: 4px;"/>
                    </div>
                    <div class="p-5" style="padding:5px 0px 0px;">
                        <label for="scopist-name">Name</label>
                        <input type="text" name="email" maxlength="50" id="scopist-name" class="text ui-widget-content ui-corner-all t-tip"  title="<fmt:message bundle='${help}' key='help.qgl.CREATE_NEW_SCOPIST_NAME'/>"/>
                    </div>
                </fieldset>
                 <p style="display:none"> Scopist already exists</p>
            </form>
        </div> 
        
        <div id="servicesreimform" title="Services Reimbursed"  style="display:none;">
             <div id="servicesreimforminner"></div>
             <div id="ratetableview"></div>
        </div>
        
        <div id="agency-rate-item-form" title="Create Agency New Rate Code"  style="display:none;">
		<div id="agency-rate-item-form-ErrorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <stripes:form action="#">
                <fieldset>
                    <div id="agencyStyle">
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        
                        <label for="agency-rate-item">Code</label>
						<label for="agency-rate-item-description">Description</label>
						<label for="agency-rate-item-value">Value</label>
						<label for="agency-rate-item-unit">Unit</label>
						<label for="agency-rate-item-perunit">PerUnit</label>
						<label for="agency-rate-item-reimbursable">Reimbursable</label>
						<label for="agency-rate-item-taxable">Taxable</label><br/>
                        
						<input type="text" name="name" maxlength="10" id="agency-rate-item-code" class="initial text ui-widget-content ui-corner-all" />
                        <input type="text" name="email" maxlength="50" id="agency-rate-item-code-description" class="descr text ui-widget-content ui-corner-all" />
                        <input type="text" name="email" maxlength="50" id="agency-rate-item-value" class="value text ui-widget-content ui-corner-all" />
                        <stripes:select id="agency-rate-item-unit" name="agency-rate-item-unit"  class="price-type-id">
                               <%--<stripes:options-collection collection="${actionBean.ratePriceType}" label="type" value="id"/>--%>
                            <c:forEach items="${actionBean.ratePriceType}" var="priceType">
						      <c:if test="${priceType.type != '%' }">
						        <option value="${priceType.id}">${priceType.type}</option>
                              </c:if>
                            </c:forEach>
                        </stripes:select> 
                        <stripes:select id="agency-rate-item-perunit" name="agency-rate-item-unit"  class="rate-item-list">
                              <stripes:options-collection collection="${actionBean.ratUnitType}" label="type" value="id"/>
                        </stripes:select>  
                        
                        <stripes:select id="agency-rate-item-perunit-expedite" name="agency-rate-item-unit" class="expedite-rate-item-list">
                        </stripes:select>                      
                        <input type="checkbox" name="email" maxlength="50" id="agency-rate-item-reimbursable" class="text ui-widget-content ui-corner-all" />
                        <input type="checkbox" name="email" maxlength="50" id="agency-rate-item-taxable" class="text ui-widget-content ui-corner-all" />
                    </div>
                </fieldset>
            </stripes:form>
        </div>
        
        <div id="servicesResDiv" title="Rate Table"  style="display:none;"><div id="servicesResInnerDiv"></div></div>
        <div id="masterTableDiv" title="A/R Master Rate Table "  style="display:none;"><div id="masterTableInnerDiv"></div></div>
        
        <div id="scopist-rate-item-form" title="Create  Scopist New RateItem"  style="display:none;">
		<div id="scopist-rate-item-form-ErrorMagDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <stripes:form action="#">
                <fieldset>
                    <div>
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="scopist-rate-item">Code</label>
                        <input type="text" name="name" maxlength="10" id="scopist-rate-item-code" class="initial text ui-widget-content ui-corner-all" />
                   
                        <label for="scopist-rate-item-description">Description</label>
                        <input type="text" name="email" maxlength="50" id="scopist-rate-item-code-description" class="text ui-widget-content ui-corner-all" />
                   
                        <label for="scopist-rate-item-value">Value</label>
                        <input type="text" name="email" maxlength="50" id="scopist-rate-item-value" class="text ui-widget-content ui-corner-all" />
                   
                   
                        <label for="scopist-rate-item-unit">Unit</label>                   
                         <stripes:select id="scopist-rate-item-unit" name="scopist-rate-item-unit" class="price-type-id">
                              <stripes:options-collection collection="${actionBean.ratePriceType}" label="type" value="id"/>
                        </stripes:select>
                      
                  
                        <label for="scopist-rate-item-perunit">PerUnit</label>                        
                         <stripes:select id="scopist-rate-item-perunit" name="scopist-rate-item-perunit"  class="rate-item-list">
                              <stripes:options-collection collection="${actionBean.ratUnitType}" label="type" value="id"/>
                        </stripes:select> 
                        
                        
                         <stripes:select id="scopist-rate-item-perunit-expedite" name="scopist-rate-item-unit" class="expedite-rate-item-list">
                        </stripes:select>                      
                   
                        <label for="scopist-rate-item-reimbursable">Reimbursable</label>
                        <input type="checkbox" name="email" maxlength="50" id="scopist-rate-item-reimbursable" class="text ui-widget-content ui-corner-all" />
                    
                        <label for="scopist-rate-item-taxable">Taxable</label>
                        <input type="checkbox" name="email" maxlength="50" id="scopist-rate-item-taxable" class="text ui-widget-content ui-corner-all" />
                    </div>
                </fieldset>
            </stripes:form>
        </div>
        
        
        
        <div id="agency-form1" title="Create  Proofer New RateItem" style="display:none;">
		<div id="agency-form1-errorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <stripes:form action="#">
                <fieldset>
                    <div>
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="proofer-rate-item">Code</label>
                        <input type="text" name="name" maxlength="10" id="proofer-rate-item-code" class="initial text ui-widget-content ui-corner-all" />
                   
                        <label for="proofer-rate-item-description">Description</label>
                        <input type="text" name="email" maxlength="50" id="proofer-rate-item-code-description" class="text ui-widget-content ui-corner-all" />
                   
                        <label for="proofer-rate-item-value">Value</label>
                        <input type="text" name="email" maxlength="50" id="proofer-rate-item-value" class="text ui-widget-content ui-corner-all" />
                   
                        <label for="proofer-rate-item-unit">Unit</label>                   
                        
                          <stripes:select id="proofer-rate-item-unit" name="proofer-rate-item-unit" class="price-type-id">
                              <stripes:options-collection collection="${actionBean.ratePriceType}" label="type" value="id"/>
                        </stripes:select>
                  
                        <label for="proofer-rate-item-perunit">PerUnit</label>
                        
                         <stripes:select id="proofer-rate-item-perunit" name="proofer-rate-item-perunit" class="rate-item-list">
                              <stripes:options-collection collection="${actionBean.ratUnitType}" label="type" value="id"/>
                        </stripes:select>  
                        
                        <stripes:select id="proofer-rate-item-perunit-expedite" name="proofer-rate-item-perunit" class="expedite-rate-item-list">
                        </stripes:select>         
                   
                        <label for="proofer-rate-item-reimbursable">Reimbursable</label>
                        <input type="checkbox" name="email" maxlength="50" id="proofer-rate-item-reimbursable" class="text ui-widget-content ui-corner-all" />
                    
                        <label for="proofer-rate-item-taxable">Taxable</label>
                        <input type="checkbox" name="email" maxlength="50" id="proofer-rate-item-taxable" class="text ui-widget-content ui-corner-all" />
                    </div>
                </fieldset>
            </stripes:form>
        </div>
        
        
        <div id="agency-cc-rate-item-form" title="Create  Agency CC Rate Code" style="display:none;">
		<div id="agency-cc-rate-item-formErrorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <stripes:form action="#">
                <fieldset>
                    <div id="agencyStyle">
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="agency-cc-rate-item">Code</label>
						<label for="agency-cc-rate-item-description">Description</label>
						<label for="agency-cc-rate-item-value">Value</label>
						<label for="agency-cc-rate-item-unit">Unit</label>
						<label for="agency-cc-rate-item-perunit">PerUnit</label>
						<label for="agency-cc-rate-item-reimbursable">Reimbursable</label>
						<label for="agency-cc-rate-item-taxable">Taxable</label><br/>
						
                        <input type="text" name="name" maxlength="10" id="agency-cc-rate-item-code" class="initial text ui-widget-content ui-corner-all" />
						<input type="text" name="email" maxlength="50" id="agency-cc-rate-item-code-description" class="text ui-widget-content ui-corner-all" />
						<input type="text" name="email" maxlength="50" id="agency-cc-rate-item-value" class="text ui-widget-content ui-corner-all" />
						<stripes:select id="agency-cc-rate-item-unit" name="agency-cc-rate-item-unit" class="price-type-id">
						    <c:forEach items="${actionBean.ratePriceType}" var="priceType">
						      <c:if test="${priceType.type != '%' }">
						        <option value="${priceType.id}">${priceType.type}</option>
                              <%-- <stripes:options-collection collection="${actionBean.ratePriceType}" label="type" value="id"/> --%>
                              </c:if>
                            </c:forEach>
                        </stripes:select>
                        <stripes:select id="agency-cc-rate-item-perunit" name="agency-cc-rate-item-perunit" class="rate-item-list">
                              <stripes:options-collection collection="${actionBean.ratUnitType}" label="type" value="id"/>
                        </stripes:select>   
                        <stripes:select id="agency-cc-rate-item-perunit-expedite" name="agency-cc-rate-item-perunit" class="expedite-rate-item-list">
                        </stripes:select>          
                        <input type="checkbox" name="email" maxlength="50" id="agency-cc-rate-item-reimbursable" class="text ui-widget-content ui-corner-all" />
                        <input type="checkbox" name="email" maxlength="50" id="agency-cc-rate-item-taxable" class="text ui-widget-content ui-corner-all" />
                    </div>
                </fieldset>
            </stripes:form>
        </div>
        
        <div id="notes-form" title="Enter Your Notes" style="display:none;">
            <form action="#">
                <fieldset>
                   <div>
                   <textarea rows="10" cols="40" id="notes"></textarea>
                   </div>
                </fieldset>
            </form>
        </div>
        
         <div id="witness-form" title="Enter Your Witness" style="display:none;">
            <form action="#">
                <fieldset>
                   <div>
                   <textarea rows="10" cols="40" id="witness"></textarea>
                   </div>
                </fieldset>
            </form>
        </div> 
        
        <div id="proofer-form" title="Create New Proofer"  style="display:none;">
		<div id="proofer-form-errorMsgDiv" class="fontStyle"></div>
            <p class="agency-validation-tips">All form fields are required.</p>
            <form action="#">
                <fieldset>
                    <div >
                        <input type="hidden" name="block-id" class="block-id" value=""/>
                        <label for="proofer-initial">Initial</label>
                        <input type="text" name="name"  maxlength="10" id="proofer-initial" class="initial text ui-widget-content ui-corner-all" style="margin-left:4px;"/>
                    </div>
                    <div class="p-5" style="padding:5px 0px 0px;">
                        <label for="proofer-name">Name</label>
                        <input type="text" name="email" maxlength="50" id="proofer-name" class="text ui-widget-content ui-corner-all t-tip"  title="<fmt:message bundle='${help}' key='help.qgl.CREATE_NEW_PROOFER_NAME'/>"/>
                    </div>
                </fieldset>
                  <p style="display:none"> Proofer already exists</p>
            </form>
        </div>

 <div id="estimatePages-form" title="MY HOURS TO PERFORM TASK" style="display:none;">
		<div id="estimatePages-formInnerDiv"></div>
            
        </div>

<%
if (request.getParameter("savedStatus") != null) {
%><div class="alert alert-success" id="successDiv"><b>Your Information Saved Successfully</b><button class="close" type="button">×</button></div><%
}
%>



         <div> Select <select onchange="callQglAction(this.options[this.selectedIndex].value)">
                      <option value="qgl-log-pending.action">Pending</option>
                      <option value="qgl-log-pending-turned-in.action">Turned In</option>
                      <option value="qgl-log-detail.action" >Detail</option>
                      <option value="qgl-log-detail-accounting.action" selected="selected">Detail Accounting</option>
                      </select>
         </div>
   
        <div class="job-table-header">
            <div class="job-row-header-bar">
                <div class="headings f-l">
                    Detail Accounting
                </div>
                <div class="clear"></div>
            </div>
        </div>
        <div class="job-table">
            <div class="job-th job-row" id="job-placeholder">
                <%--<div class="job-column job-th status">STATUS</div> --%>
                <div class="job-column job-th agency">A/R</div>
                <div class="job-column job-th date-taken">DATE TAKEN</div>
                <div class="job-column job-th est-pgs">EST PGS</div>
                <div class="job-column job-th scopist">SCOPIST</div>
                <div class="job-column job-th proofer">PROOFER</div>
                <div class="job-column job-th case-name">CASE/JOB NAME</div>
                <div class="job-column job-th scopist-hrs">SCOPIST HRS</div>
                <div class="job-column job-th proofer-hrs">PROOFER HRS</div>
                <div class="job-column job-th total-ar">TOTAL A/R</div>
                <div class="job-column job-th agency-due">DUE DATE AGY</div>
                <div class="job-column job-th hrs-to-do">HRS TO DO</div>
                <%--<div class="job-column job-th actions">ACTIONS</div>--%>
                <%--<div class="clear"></div>--%>
            </div>
             <div class="job-th job-row" id="job-placeholder">
                <div class="job-column job-th type">TYPE</div>
                <div class="job-column job-th job">JOB #</div>
                <div class="job-column job-th actul-pgs">ACTUAL</div>
                <div class="job-column job-th scop-to">DATE TO</div>
                <div class="job-column job-th prof-to">DATE TO</div>
                <div class="job-column job-th witness">WITNESS</div>
                <div class="job-column job-th scop-actul-pgs">ACTUAL</div>
                <div class="job-column job-th prof-actul-pgs">ACTUAL</div>
                <div class="job-column job-th total-ap">TOTAL A/P</div>
                <div class="job-column job-th due-atty-in">DUE DATE CLIENT</div>
                <div class="job-column job-th total-hrs">TOTAL HRS</div>
                 <%--<div class="job-column job-th actions">ACTIONS</div>--%>
                <%--<div class="clear"></div>--%>
            </div>
            <div class="job-th job-row" id="job-placeholder">
                <div class="job-column job-th docs">Orig +</div>
                <div class="job-column job-th services-reimbured">REIMBURSED Services/Expenses</div>
                <div class="job-column job-th services-nonreimbured">NON-REIMBURSED Services/Expenses</div>
                <div class="job-column job-th scop-from">DATE FROM</div>
                <div class="job-column job-th prof-from">DATE FROM</div>
                <div class="job-column job-th notes">NOTES</div>
                <div class="job-column job-th notes">TTL DUE SCOPIST</div>
                <div class="job-column job-th actul-turned-in">TTL DUE PR00FER</div>
                <div class="job-column job-th status">TOTAL NET</div>
                <div class="job-column job-th actul-turned-in">TURN-IN DATE</div>
                <div class="job-column job-th balance-due">BAL DUE</div>
                 <%--<div class="job-column job-th actions">ACTIONS</div>--%>
                <%--<div class="clear"></div>--%>
            </div>
           </div>
            
            <c:set var="jobIndex" value="0"/>
            <c:forEach items="${actionBean.jobs}" var="job" varStatus="jobStatus">
              <form class="job-record-block job-table" id="detail-accounting-${jobStatus.index}" action="${pageContext.request.contextPath}<%=QglLogDetailAccountingAction.URL%>">
                  <div class="job-row">
                   
                    <div class="job-column agency" id="agency-${jobStatus.index}">
                    <c:if test="${job.agencyEditable}">
                      <c:if test="${job.agencyEnabled == true}">                    
                       <span class="view t-tip" title="<c:if test='${job.agencyRateCode == null}'>No Rate Code Selected For Agency, </c:if><c:if test='${job.agencyRateCode != null}'>Agency Rate Code: ${job.agencyRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.AGENCY'/>"><span class="agencylink" id="agencylink${job.jobId}"> <a href="javascript:{getRateTableId(${job.agencyId},${job.jobId },'AGENCY')}">${job.agencyInitial}</a></span></span>
                       <!--<span class="edit t-tip" title="<h4><c:if test='${job.agencyRateCode == null}'>No RateCode Selected.</c:if><c:if test='${job.agencyRateCode != null}'> Agency RateCode: ${job.agencyRateCode}</c:if></h4><fmt:message bundle='${help}' key='help.qgl.AGENCY'/>"> <a href="javascript:{ getRateTableId(${job.agencyId},${job.jobId },'AGENCY')}">${job.agencyInitial}</a></span>-->
                       
                      </c:if>
                      
                      <c:if test="${job.agencyEnabled == false}">                    
                       <span class="view t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>"> <a href="javascript:{}">${job.agencyInitial}</a></span>
                      </c:if>
                      <input  class="edit agency-initial" onblur="saveSelectedJob(${job.jobId},true);" maxlength="10" type="text" name="job.agencyInitial" value="${job.agencyInitial}"/>
                     </c:if>
                     <c:if test="${!job.agencyEditable}">
                       <c:if test="${job.agencyEnabled == true}">                    
                       <span class="t-tip" title="<c:if test='${job.agencyRateCode == null}'>No Rate Code Selected For Agency, </c:if><c:if test='${job.agencyRateCode != null}'>Agency Rate Code: ${job.agencyRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.AGENCY'/>"><span class="agencylink" id="agencylink${job.jobId}"> ${job.agencyInitial}</span></span>
                      </c:if>
                      
                      <c:if test="${job.agencyEnabled == false}">                    
                       <span class="t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>"> ${job.agencyInitial}</span>
                      </c:if>
                     </c:if>
                        <input type="hidden" id="agencyId${job.jobId}" class="agency-id" name="job.agencyId" value="${job.agencyId}"/>
                        <!-- <input  class="edit agency-initial" onblur="saveSelectedJob(${job.jobId},true);" maxlength="10" type="text" name="job.agencyInitial" value="${job.agencyInitial}"/>-->
                        <input type="hidden" class="agency-name" name="job.agencyName" value=""/>
                    </div>
                    <div class="job-column date-taken date">
                        <span class="view">${job.takenDateString}</span>
                         <c:if test="${job.agencyEditable}">   
                           <input class="edit date-picker" id="dateTaken${job.jobId}"  onchange="saveSelectedJob(${job.jobId},false);"  type="text" name="job.takenDate" id="job.takenDate-${jobStatus.index}" value="${job.takenDateString}" readonly="readonly">
                         </c:if>
                         <c:if test="${!job.agencyEditable}">
                           <span class="edit">${job.takenDateString}</span>
                           <input style="display:none;" id="dateTaken${job.jobId}"  onchange="saveSelectedJob(${job.jobId},false);"  type="text" name="job.takenDate" id="job.takenDate-${jobStatus.index}" value="${job.takenDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column est-pgs number">
                       <span class="view">${job.estimatePages}</span>
                       <c:if test="${job.agencyEditable}">   
                         <input class="edit t-tip numberVal estimatePages" type="text" id="estPgs${job.jobId}"  onchange="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});"  name="job.estimatePages" value="${job.estimatePages}" title="<fmt:message bundle='${help}' key='help.qgl.EST_PGS'/>">
                       </c:if>
                       <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.estimatePages}</span>  
                          <input style="display:none;" type="text" id="estPgs${job.jobId}"  onchange="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});"  name="job.estimatePages" value="${job.estimatePages}" title="<fmt:message bundle='${help}' key='help.qgl.EST_PGS'/>">
                       </c:if>
                    </div>
                   <div class="job-column scopist" id="scopist-${jobStatus.index}">
                     <c:if test="${job.scopistEditable}">
                         <c:choose>
	                   		<c:when test="${job.scopistId eq actionBean.userId}">
	                        <span class="view" ><span class="scopistlink" id="scopistlink${job.jobId}">${job.scopistInitial}</span></span>
	                         <input  class="edit scopist-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});" type="text" name="job.scopistInitial" value="${job.scopistInitial}"/>
	                        
	                        </c:when>
	                        <c:otherwise>
	                        
	                        <c:if test="${job.scopistEnabled == true}">                    
	                        
	                        <span class="view t-tip" title="<c:if test='${job.scopiestRateCode == null}'>No Rate Code Selected For Scopist, </c:if><c:if test='${job.scopiestRateCode != null}'> Scopist Rate Code: ${job.scopiestRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.SCOPIST'/>"> <span class="scopistlink" id="scopistlink${job.jobId}"><a href="javascript:{ getRateTableId(${job.scopistId},${job.jobId },'SCOPIST')}">${job.scopistInitial}</a></span></span>
	                         
	                        
	                        </c:if>
	                        
	                         <c:if test="${job.scopistEnabled == false}">                    
	                        
	                           <span class="view t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>"> <a href="javascript:{}">${job.scopistInitial}</a></span>

	                        </c:if>
	                         <input  class="edit scopist-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});" type="text" name="job.scopistInitial" value="${job.scopistInitial}"/>
	                        </c:otherwise>
                        </c:choose>
                        </c:if>
                        <c:if test="${!job.scopistEditable}">
                          <c:choose>
	                   		<c:when test="${job.scopistId eq actionBean.userId}">
	                        <span>${job.scopistInitial}</span>
	                        </c:when>
	                        <c:otherwise>
	                        
	                        <c:if test="${job.scopistEnabled == true}">                    
	                        
	                        <span class="t-tip" title="<c:if test='${job.scopiestRateCode == null}'>No Rate Code Selected For Scopist, </c:if><c:if test='${job.scopiestRateCode != null}'>Scopist Rate Code: ${job.scopiestRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.SCOPIST'/>"><span class="scopistlink" id="scopistlink${job.jobId}">${job.scopistInitial}</span></span>	                        
	                        </c:if>
	                        
	                         <c:if test="${job.scopistEnabled == false}">                    
	                        
	                        <span class="view t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>">${job.scopistInitial}</span>	                        
	                        </c:if>
	                        
	                        </c:otherwise>
                        </c:choose>
                        </c:if>
                        <input type="hidden" id="scopistId${job.jobId}" class="scopist-id" name="job.scopistId" value="${job.scopistId}"/>
<%--                         <input  class="edit scopist-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateMyHoursTODO(${job.jobId})" type="text" name="job.scopistInitial" value="${job.scopistInitial}"/>
 --%>                        <input type="hidden"  id="scopistName${job.jobId}" class="scopist-name" name="job.scopistName" value=""/>
                    
                    
                    <div class="scopist" id="scopist-rate-item-${jobStatus.index}">
                        <!-- <span class="view">${job.scopistRateItemCode}</span> -->
                        <input type="hidden" id="scopistRateId${job.jobId}" class="scopist-rate-item-id" name="job.scopistRateItemId" value="${job.scopistRateItemId}"/>
                       <!-- <input  class="edit scopist-rate-item-code" maxlength="10" onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.scopistRateItemCode" value="${job.scopistRateItemCode}"/>-->
                        <input type="hidden" class="scopist-rate-item-code-description" name="job.scopistRateItemCodeDescription" value=""/>
                        <input type="hidden" class="scopist-rate-item-value" name="job.scopistRateItemValue" value=""/>
                        <input type="hidden" class="scopist-rate-item-unit" name="job.scopistRateItemUnit" value=""/>
                        <input type="hidden" class="scopist-rate-item-perunit" name="job.scopistRateItemPerUnit" value=""/>
                        <input type="hidden" class="scopist-rate-item-reimbursable" name="job.scopistRateItemReimbursable" value=""/>
                        <input type="hidden" class="scopist-rate-item-taxable" name="job.scopistRateItemTaxable" value=""/>
                        <input type="hidden" class="scopist-rate-item-perunit-expedite" name="job.scopistRateItemExpedite" value=""/>
                        <input type="hidden" class="scopist-job-id" name="job.jobId" value="${job.jobId}"/>
                        
                        
                        
                    </div>
                    </div> 
                    <div class="job-column proofer" id="proofer-${jobStatus.index}">
                    <c:if test="${job.prooferEditable}">
                    <c:choose>
	                    <c:when test="${job.prooferId eq actionBean.userId}">
	                         <span class="view " ><span class="prooferlink" id="prooferlink${job.jobId}">${job.prooferInitial}</span></span>
	                        <input  class="edit proofer-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});" type="text" name="job.prooferInitial"  value="${job.prooferInitial}"/>
           
	                     </c:when>
                        <c:otherwise>
                        
                        <c:if test="${job.prooferEnabled == true}">
                        
                        <span class="view t-tip" title="<c:if test='${job.prooferRateCode == null}'>No Rate Code Selected For Proofer, </c:if><c:if test='${job.prooferRateCode != null}'>Proofer Rate Code: ${job.prooferRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.PROOFER'/>"><span class="prooferlink" id="prooferlink${job.jobId}"><a href="javascript:{ getRateTableId(${job.prooferId},${job.jobId },'PROOFER')}">${job.prooferInitial}</a></span></span>
                       
                        
                        </c:if>
                        
                        <c:if test="${job.prooferEnabled == false}">
                        
                        <span class="view t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>"><a href="javascript:{}">${job.prooferInitial}</a></span>
                        
                        </c:if>
                        <input  class="edit proofer-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateAllHours(${job.jobId});" type="text" name="job.prooferInitial"  value="${job.prooferInitial}"/>
                        </c:otherwise>
                     </c:choose>
                     </c:if>
                     <c:if test="${!job.prooferEditable}">
                      <c:choose>
	                    <c:when test="${job.prooferId eq actionBean.userId}">
	                         <span  ><span class="prooferlink" id="prooferlink${job.jobId}">${job.prooferInitial}</span></span>          
	                     </c:when>
                        <c:otherwise>
                        
                        <c:if test="${job.prooferEnabled == true}">
                        
                        <span class="t-tip" title="<c:if test='${job.prooferRateCode == null}'>No Rate Code Selected For Proofer, </c:if><c:if test='${job.prooferRateCode != null}'> Proofer Rate Code: ${job.prooferRateCode}, </c:if><fmt:message bundle='${help}' key='help.qgl.dblclck.PROOFER'/>"><span class="prooferlink" id="prooferlink${job.jobId}">${job.prooferInitial}</span></span>  
                        </c:if>
                        
                        <c:if test="${job.prooferEnabled == false}">
                        
                        <span class="t-tip" title="<fmt:message bundle='${help}' key='help.qgl.dblclck.ARCHIVE'/>">${job.prooferInitial}</span>                     
                        </c:if>
                        
                        </c:otherwise>
                     </c:choose>
                     </c:if>
                       <!--  <span class="view">${job.prooferInitial}</span>-->
                        <input type="hidden"  id="prooferId${job.jobId}"  class="proofer-id" name="job.prooferId" value="${job.prooferId}"/>
                        <!--<input  class="edit proofer-initial" maxlength="10"  onblur="saveSelectedJob(${job.jobId},true);caluculateMyHoursTODO(${job.jobId})" type="text" name="job.prooferInitial"  value="${job.prooferInitial}"/>-->
                        <input type="hidden"  id="prooferName${job.jobId}"  class="proofer-name" name="job.prooferName" value=""/>
                        
                        
                        <div class="scopist" id="proofer-rate-item-${jobStatus.index}">
                        <!-- <span class="view">${job.prooferRateItemCode}</span>-->
                       <input type="hidden" id="prooferRateId${job.jobId}"  class="proofer-rate-item-id" name="job.prooferRateItemId" value="${job.prooferRateItemId}"/> 
                        <!--  <input  class="edit proofer-rate-item-code"  onblur="saveSelectedJob(${job.jobId},true);"  maxlength="10" type="text" name="job.prooferRateItemCode" value="${job.prooferRateItemCode}"/>-->
                        <input type="hidden" class="proofer-rate-item-code-description" name="job.prooferRateItemCodeDescription" value=""/>
                        <input type="hidden" class="proofer-rate-item-value" name="job.prooferRateItemValue" value=""/>
                        <input type="hidden" class="proofer-rate-item-unit" name="job.prooferRateItemUnit" value=""/>
                        <input type="hidden" class="proofer-rate-item-perunit" name="job.prooferRateItemPerUnit" value=""/>
                        <input type="hidden" class="proofer-rate-item-reimbursable" name="job.prooferRateItemReimbursable" value=""/>
                        <input type="hidden" class="proofer-rate-item-taxable" name="job.prooferRateItemTaxable" value=""/>
                        <input type="hidden" class="proofer-rate-item-perunit-expedite " name="job.prooferRateItemExpedite" value=""/>
                        <input type="hidden" class="proofer-job_id" name="job.jobId" value="${job.jobId}"/>
                        
                        
                    </div>
                    </div>
                    <div class="job-column case-name">
                        <span class="view">${job.caseName}</span>
                        <c:if test="${job.agencyEditable}">
                          <input style="max-width:90px;" class="edit t-tip"  id="caseName${job.jobId}"  onblur="saveSelectedJob(${job.jobId},false);"  type="text" name="job.caseName" value="${job.caseName}" title="<fmt:message bundle='${help}' key='help.qgl.CASE/JOB_NAME'/>">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                           <span class="edit">${job.caseName}</span>
                           <input style="display:none;max-width:90px;"  id="caseName${job.jobId}"  onblur="saveSelectedJob(${job.jobId},false);"  type="text" name="job.caseName" value="${job.caseName}" title="<fmt:message bundle='${help}' key='help.qgl.CASE/JOB_NAME'/>">
                        </c:if>
                    </div>
                    <div class="job-column scopist-hrs number">
                      <c:if test="${job.scopistValReq}">
                         <span class="view">${job.scopistHours}</span>
                      </c:if>
                      <c:if test="${!job.scopistValReq}">
                         <span class="view"></span>
                      </c:if>
                        <c:if test="${job.agencyEditable}">
                          <c:if test="${job.scopistValReq}">
                           <input class="edit numberValForDecimal"  readonly id="scopistHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.scopistHours" value="${job.scopistHours}">
                          </c:if>
                          <c:if test="${!job.scopistValReq}">
                           <input class="edit numberValForDecimal"  readonly id="scopistHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.scopistHours" value="">
                          </c:if>
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <c:if test="${job.scopistValReq}">
                            <span class="edit">${job.scopistHours}</span>
                             <input style="display:none;"  id="scopistHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.scopistHours" value="${job.scopistHours}">
                          </c:if>
                          <c:if test="${!job.scopistValReq}">
                            <span class="edit"></span>
                             <input style="display:none;"  id="scopistHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.scopistHours" value="">
                          </c:if>
                         
                        </c:if>
                    </div>
                    <div class="job-column proofer-hrs number">
                        <c:if test="${job.prooferValReq}">
                           <span class="view">${job.prooferHours}</span>
                        </c:if>
                        <c:if test="${!job.prooferValReq}">
                           <span class="view"></span>
                        </c:if>
                        <c:if test="${job.agencyEditable}">
                         <c:if test="${job.prooferValReq}">
                          <input class="edit numberValForDecimal" readonly id="prooferHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.prooferHours" value="${job.prooferHours}">
                          </c:if>
                           <c:if test="${!job.prooferValReq}">
                          <input class="edit numberValForDecimal" readonly id="prooferHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.prooferHours" value="">
                          </c:if>
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <c:if test="${job.prooferValReq}">
                            <span class="edit">${job.prooferHours}</span>
                            <input style="display:none;"  id="prooferHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.prooferHours" value="${job.prooferHours}">
                          </c:if>
                          <c:if test="${!job.prooferValReq}">
                            <span class="edit"></span>
                            <input style="display:none;"  id="prooferHrs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"  type="text" name="job.prooferHours" value="">
                          </c:if>
                       </c:if>
                    </div>
                    <div class="job-column total-ar">
                        <span  id="receivableAmount${job.jobId}"><fmt:formatNumber value="${job.receivableAmount}" type="currency"/></span>
                    </div>
                    <div class="job-column agency-due  date">
                        <span class="view">${job.agencyDueDateString}</span>
                        <c:if test="${job.agencyEditable}">
                          <input class="edit date-picker"   onChange="setAuttyDate(this.id);" id="dueAgenctDt${job.jobId}" onchange="saveSelectedJob(${job.jobId},false);"   type="text" name="job.agencyDueDate" id="job.agencyDueDate-${jobStatus.index}" value="${job.agencyDueDateString}" readonly="readonly">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.agencyDueDateString}</span>
                          <input style="display:none;"   onChange="setAuttyDate(this.id);" id="dueAgenctDt${job.jobId}" onchange="saveSelectedJob(${job.jobId},false);"   type="text" name="job.agencyDueDate" id="job.agencyDueDate-${jobStatus.index}" value="${job.agencyDueDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column hrs-to-do number">
                        <span class="view">${job.toDoHours}</span>
                       <c:if test="${job.agencyEditable || job.scopistEditable || job.prooferEditable}">
                          <input class="edit t-tip" id="hrsToDo${job.jobId}" readonly="readonly"  onblur="saveSelectedJob(${job.jobId},false);"  type="text" name="job.toDoHours" value="${job.toDoHours}" title="<fmt:message bundle='${help}' key='help.qgl.HOURS_TO_DO'/>">
                        </c:if>
                        <c:if test="${!job.agencyEditable && !job.scopistEditable && !job.prooferEditable}">
                          <span class="edit">${job.toDoHours}</span>
                          <input style="display:none;" id="hrsToDo${job.jobId}"  onblur="saveSelectedJob(${job.jobId},false);"  readonly="readonly" type="text" name="job.toDoHours" value="${job.toDoHours}" title="<fmt:message bundle='${help}' key='help.qgl.HOURS_TO_DO'/>">
                        </c:if>
                    </div>
					  <input type="hidden" name="pendingEdit"  value="${actionBean.pendingEdit}"/>
                     <input type="hidden" name="pendingTurnInEdit"  value="${actionBean.pendingTurnInEdit}"/>
                     <input type="hidden" name="detailEdit"  value="${actionBean.detailEdit}"/>
                    <input type="hidden" id="jobId${job.jobId}" class="jobId" name="jobId" value="${job.jobId}"/>
                  </div>
                   <div class="job-row">
                    <div class="job-column agency" id="jobtype-${jobStatus.index}">
                        <input type="hidden" id="typeId${job.jobId}" class="type-id agency-rate-item" name="job.jobTypeId" value="${job.jobTypeId}"/>
                        <span class="view jobtypetext">${job.jobCode}</span>
                       <c:if test="${job.agencyEditable}">
                        <input  class="edit callAjaxTGetAgencyCodes"  onfocus="getInitialValue(this)" onblur="saveSelectedJob(${job.jobId},true);getChangedValue(this);"   type="text" name="job.jobCode" value="${job.jobCode}">
                       </c:if>
                       <c:if test="${!job.agencyEditable}">
                          <span class="edit jobtypetext">${job.jobCode}</span>
                       </c:if> 
                        <input type="hidden" class="agency-rate-item-code-description" name="job.agencyRateItemCodeDescription" value=""/>
                        <input type="hidden" class="agency-rate-item-value" name="job.agencyRateItemValue" value=""/>
                        <input type="hidden" class="agency-rate-item-unit" name="job.agencyRateItemUnit" value=""/>
                        <input type="hidden" class="agency-rate-item-perunit" name="job.agencyRateItemPerUnit" value=""/>
                        <input type="hidden" class="agency-rate-item-reimbursable" name="job.agencyRateItemReimbursable" value=""/>
                        <input type="hidden" class="agency-rate-item-taxable" name="job.agencyRateItemTaxable" value=""/>
                        <input type="hidden" class="agency-rate-item-perunit-expedite" name="job.agencyRateItemExpedite" value=""/>
                        <input type="hidden" class="agency-job_id" name="job.jobId" value="${job.jobId}"/>
                        
                        
                    
                    </div>
            
                    <div class="job-column">
                        <span class="view">${job.jobReference}</span>
                        <c:if test="${job.agencyEditable}">
                         <input class="edit job-id"  id="jobReqId${job.jobId}"    type="text" name="job.jobReference" value="${job.jobReference}">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.jobReference}</span>
                          <input style="display:none;"  id="jobReqId${job.jobId}"    type="text" name="job.jobReference" value="${job.jobReference}">
                        </c:if>
                    </div>
                    <div class="job-column actul-pgs number">
                        <span id="actulPgsView${job.jobId}" class="view">${job.actualPages}</span>
                        <c:if test="${job.agencyEditable}">
                         <input class="edit numberVal"  id="actulPgs${job.jobId}" onchange="saveccvalue(${job.jobId},this.id, ${job.agencyId});" onblur="saveSelectedJob(${job.jobId},true);" type="text" name="job.actualPages" value="${job.actualPages}">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.actualPages}</span>
                          <input style="display:none;" id="actulPgs${job.jobId}" onblur="saveSelectedJob(${job.jobId},true);" type="text" name="job.actualPages" value="${job.actualPages}">
                        </c:if>
                    </div>
                    <div class="job-column scop-to date">
                        <span class="view">${job.scopistToDateString}</span>
                         <c:if test="${job.scopistEditable}">
                          <input class="edit date-picker"  onchange="saveSelectedJob(${job.jobId},false);"  id="scopistTo${job.jobId}"  type="text" name="job.scopistToDate"  value="${job.scopistToDateString}" readonly="readonly">                    
                         </c:if>
                         <c:if test="${!job.scopistEditable}">
                          <span class="edit">${job.scopistToDateString}</span>
                         <input style="display:none;" onchange="saveSelectedJob(${job.jobId},false);"  id="scopistTo${job.jobId}"  type="text" name="job.scopistToDate"  value="${job.scopistToDateString}" readonly="readonly">                    
                        </c:if>
                    </div>
                    <div class="job-column prof-to  date">
                        <span class="view">${job.prooferToDateString}</span>
                         <c:if test="${job.prooferEditable}">
                           <input class="edit date-picker" type="text"  onchange="saveSelectedJob(${job.jobId},false);" id="prooferTo${job.jobId}"  name="job.prooferToDate"  value="${job.prooferToDateString}" readonly="readonly">
                         </c:if>
                        <c:if test="${!job.prooferEditable}">
                          <span class="edit">${job.prooferToDateString}</span>
                        <input style="display:none;" type="text"  onchange="saveSelectedJob(${job.jobId},false);" id="prooferTo${job.jobId}"  name="job.prooferToDate"  value="${job.prooferToDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column witness">
                        <span class="view">${job.witness}</span>
                        <c:if test="${job.agencyEditable}">
                         <input style="max-width:90px;" class="edit witnes"  id="witness${job.jobId}"  onblur="saveSelectedJob(${job.jobId},false);" onchange="saveSelectedJob(${job.jobId},false);"   type="text" name="job.witness" value="${job.witness}">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.witness}</span>
                          <input style="display:none;max-width:90px;" id="witness${job.jobId}"  onblur="saveSelectedJob(${job.jobId},false);" onchange="saveSelectedJob(${job.jobId},false);"   type="text" name="job.witness" value="${job.witness}">
                        </c:if>
                    </div>
                    <div class="job-column scop-actul-pgs number">
                        <span class="view">${job.scopistActualPages}</span>
                        <c:if test="${job.scopistEditable}">
                         <input class="edit numberVal"  id="scActulPgs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"   type="text" name="job.scopistActualPages" value="${job.scopistActualPages}">
                        </c:if>
                        <c:if test="${!job.scopistEditable}">
                          <span class="edit">${job.scopistActualPages}</span>
                          <input style="display:none;" id="scActulPgs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"   type="text" name="job.scopistActualPages" value="${job.scopistActualPages}">
                        </c:if>
                    </div>
                    <div class="job-column proof-actul-pgs number">
                        <span class="view">${job.prooferActualPages}</span>
                        <c:if test="${job.prooferEditable}">
                         <input class="edit numberVal"  id="prActulPgs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"   type="text" name="job.prooferActualPages" value="${job.prooferActualPages}">
                        </c:if>
                        <c:if test="${!job.prooferEditable}">
                          <span class="edit">${job.prooferActualPages}</span>
                          <input style="display:none;" id="prActulPgs${job.jobId}"  onblur="saveSelectedJob(${job.jobId},true);"   type="text" name="job.prooferActualPages" value="${job.prooferActualPages}">
                        </c:if>
                    </div>
                    <div class="job-column total-ap">
                        <span  id="payableAmount${job.jobId}"><fmt:formatNumber value="${job.payableAmount}" type="currency"/></span>
                    </div>
                    <div class="job-column due-atty-in  date">
                        <span class="view">${job.attyDueDateString}</span>
                        <c:if test="${job.agencyEditable}">
                         <input class="edit date-picker attyDate"  type="text" onchange="saveSelectedJob(${job.jobId},false);" name="job.attyDueDate" id="dueAuttyDt${job.jobId}"  value="${job.attyDueDateString}" readonly="readonly">                    
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.attyDueDateString}</span>
                          <input style="display:none;"  type="text" onchange="saveSelectedJob(${job.jobId},false);" name="job.attyDueDate" id="dueAuttyDt${job.jobId}"  value="${job.attyDueDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column total-hrs number">
                        <span class="view">${job.totalHours}</span>             
                        <c:if test="${job.agencyEditable || job.scopistEditable || job.prooferEditable}">
                          <input class="edit"  id="totalHrs${job.jobId}"  readonly="readonly"  onblur="saveSelectedJob(${job.jobId},false);"  type="text" name="job.totalHours" value="${job.totalHours}">
                        </c:if>
                        <c:if test="${!job.agencyEditable && !job.scopistEditable && !job.prooferEditable}">
                          <span class="edit">${job.totalHours}</span>
                          <input style="display:none;"  id="totalHrs${job.jobId}"  readonly="readonly"  onblur="saveSelectedJob(${job.jobId},false);"  type="text" name="job.totalHours" value="${job.totalHours}">
                        </c:if>
                    </div>
                  </div>
                   <div class="job-row">
                     <div class="job-column docs">
                        <span id="ccValView${job.jobId}" class="view">${job.ccPages}</span>
                        <c:if test="${job.agencyEditable}">
                          <input class="edit cc-code numberVal"  id="ccVal${job.jobId}"  onchange="saveccvalue(${job.jobId},this.id, ${job.agencyId});" onblur="saveSelectedJob(${job.jobId},true);saveccvalue(${job.jobId},this.id,${job.agencyId});"  type="text" name="job.ccPages" value="${job.ccPages}">
                        </c:if>
                        <c:if test="${!job.agencyEditable}"> 
                          <span id="ccValView${job.jobId}" class="edit">${job.ccPages}</span>
                          <input style="display:none;"  id="ccVal${job.jobId}"  onchange="saveccvalue(${job.jobId},this.id, ${job.agencyId});" onblur="saveSelectedJob(${job.jobId},true);saveccvalue(${job.jobId},this.id,${job.agencyId});"  type="text" name="job.ccPages" value="${job.ccPages}">
                        </c:if>              
                        <input type="hidden" class="agency-cc-rate-item-id" name="job.agencyCcRateItemId" value="${job.agencyCcRateItemId}"/>
                        <input type="hidden" class="agency-cc-rate-item-code-description" name="job.agencyCcRateItemCodeDescription" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-value" name="job.agencyCcRateItemValue" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-unit" name="job.agencyCcRateItemUnit" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-perunit" name="job.agencyCcRateItemPerUnit" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-reimbursable" name="job.agencyCcRateItemReimbursable" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-taxable" name="job.agencyCcRateItemTaxable" value=""/>
                        <input type="hidden" class="agency-cc-rate-item-perunit-expedite" name="job.agencyCcRateItemExpedite" value=""/>
                    
                        
                    </div>
                    <div class="job-column services-reimbured">
                    
                    
                          <c:if test="${job.servicesReimbursed}">
                            <c:if test="${job.agencyEditable}">
                              <span class="view" id="servicereimtext${job.jobId}"><a href="javascript:{}" onclick="getAllReimbursedServices(${job.jobId},'servicesReim${job.jobId}','reim')">${job.servicesReimbursedType}</a></span>
                            </c:if>
                            <c:if test="${!job.agencyEditable}">
                              <span id="servicereimtext${job.jobId}">${job.servicesReimbursedType}</span>
                            </c:if>
                       </c:if>
                        <c:if test="${!job.servicesReimbursed}">
                             <c:if test="${job.agencyEditable}">
                               <span class="view" id="servicereimtext${job.jobId}">${job.servicesReimbursedType}</span>
                             </c:if>
                             <c:if test="${!job.agencyEditable}">
                               <span id="servicereimtext${job.jobId}">${job.servicesReimbursedType}</span>
                             </c:if>
                       </c:if>
                       <c:if test="${job.agencyEditable}">
                        <span class="edit">
                       </c:if>
                       <c:if test="${!job.agencyEditable}">
                        <span  style="display:none">
                       </c:if>
                        <c:if test="${job.servicesReimbursed}">
                          <select name="job.servicesReimbursed"  onchange="getAllReimbursedServices(${job.jobId},this.id,'reim')" onblur="saveSelectedJob(${job.jobId},true);"  id="servicesReim${job.jobId}">
                            <option value=false>No</option>
                            <option value=true selected="selected">Yes</option>
                        </select>
                        </c:if> 
                       <c:if test="${!job.servicesReimbursed}">
                       <select name="job.servicesReimbursed" onchange="getAllReimbursedServices(${job.jobId},this.id,'reim')" onblur="saveSelectedJob(${job.jobId},true);"  id="servicesReim${job.jobId}" >
                       <option value=false selected="selected">No</option>
                       <option value=true>Yes</option>
                        </select>
                        </c:if> 
                        <a  title="Click here to get all reimbursed services" href="javascript:{getAllReimbursedServices(${job.jobId},'servicesReim${job.jobId}','reim')}"><img alt="Edit"  src="${pageContext.request.contextPath}/images/popup_icon.gif" /></a>
                        
                         
                       </span>
                    </div>
                    <div class="job-column services-nonreimbured" style="width:110px;display: inherit;">
                         <c:if test="${job.expensesNonReimbursed}" >
                           
                           <c:if test="${job.agencyEditable}">
                              <span class="view" id="servicenonreimtext${job.jobId}"><a href="javascript:{}" onclick="getAllReimbursedServices(${job.jobId},'expenNonReim${job.jobId}','non')">${job.expensesNonReimbursedType}</a></span>
                            </c:if>
                            <c:if test="${!job.agencyEditable}">
                              <span  id="servicenonreimtext${job.jobId}">${job.expensesNonReimbursedType}</span>
                            </c:if>
                         
                         </c:if>
                        <c:if test="${!job.expensesNonReimbursed}" >
                          <c:if test="${job.agencyEditable}">
                               <span class="view" id="servicenonreimtext${job.jobId}">${job.expensesNonReimbursedType}</span>
                             </c:if>
                             <c:if test="${!job.agencyEditable}">
                               <span id="servicenonreimtext${job.jobId}">${job.expensesNonReimbursedType}</span>
                             </c:if>
                       </c:if>
                        <c:if test="${job.agencyEditable}">
                          <span class="edit">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span  style="display:none">
                        </c:if>
                       <c:if test="${job.expensesNonReimbursed}" >
                          <select name="job.expensesNonReimbursed" id="expenNonReim${job.jobId}" onchange="getAllReimbursedServices(${job.jobId},this.id,'non')" onblur="saveSelectedJob(${job.jobId},false);" >
                            <option value=false>No</option>
                            <option value=true selected="selected">Yes</option>
                        </select>
                        </c:if>
                       <c:if test="${!job.expensesNonReimbursed}">
                          <select name="job.expensesNonReimbursed"  onblur="saveSelectedJob(${job.jobId},false);" onchange="getAllReimbursedServices(${job.jobId},this.id,'non')" id="expenNonReim${job.jobId}" >
                            <option value=false selected="selected">No</option>
                            <option value=true>Yes</option>
                        </select>
                        </c:if>
                 <a title="Click here to get all non reimbursed services" href="javascript:{getAllReimbursedServices(${job.jobId},'expenNonReim${job.jobId}','non')}"><img alt="Edit"  src="${pageContext.request.contextPath}/images/popup_icon.gif" /></a>                        
                        </span>
                    </div>
                    <div class="job-column scop-from  date">
                        <span class="view">${job.scopistFromDateString}</span> 
                        <c:if test="${job.scopistEditable}">              
                          <input class="edit date-picker scopist-date"  onchange="saveSelectedJob(${job.jobId},false);"  id="scopistFrom${job.jobId}"  type="text" name="job.scopistFromDate"  value="${job.scopistFromDateString}" readonly="readonly">
                        </c:if>
                        <c:if test="${!job.scopistEditable}">
                          <span class="edit">${job.scopistFromDateString}</span>               
                          <input style="display:none;"  onchange="saveSelectedJob(${job.jobId},false);"  id="scopistFrom${job.jobId}"  type="text" name="job.scopistFromDate"  value="${job.scopistFromDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column prof-from  date">
                        <span class="view">${job.prooferFromDateString}</span>  
                        <c:if test="${job.prooferEditable}">                    
                          <input class="edit date-picker" type="text"  onchange="saveSelectedJob(${job.jobId},false);"  id="prooferFrom${job.jobId}"  name="job.prooferFromDate"  value="${job.prooferFromDateString}" readonly="readonly">
                        </c:if>
                        <c:if test="${!job.prooferEditable}">
                          <span class="edit">${job.prooferFromDateString}</span>                      
                          <input style="display:none;" type="text"  onchange="saveSelectedJob(${job.jobId},false);"  id="prooferFrom${job.jobId}"  name="job.prooferFromDate"  value="${job.prooferFromDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column notes">
                        <span class="view">${job.notes}</span>
                        <c:if test="${job.agencyEditable}">
                          <input style="max-width:90px;" class="edit note"  id="notes${job.jobId}" onblur="saveSelectedJob(${job.jobId},false);"  onchange="saveSelectedJob(${job.jobId},false);"  type="text" name="job.notes" value="${job.notes}">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.notes}</span>
                          <input style="display:none;max-width:90px;"  id="notes${job.jobId}" onblur="saveSelectedJob(${job.jobId},false);"  onchange="saveSelectedJob(${job.jobId},false);"  type="text" name="job.notes" value="${job.notes}">
                        </c:if>
                    </div>
                    <div class="job-column services-reimbured">
                        
                        <span   id="scopistPayable${job.jobId}"><fmt:formatNumber value="${job.scopistPayable}" type="currency"/></span>
                       
                    </div>
                    <div class="job-column services-nonreimbured">
                        
                        <span  id="prooferPayable${job.jobId}"><fmt:formatNumber value="${job.prooferPayable}" type="currency"/> </span>
                    </div>
                    <div class="job-column services-nonreimbured">
                        
                        <span  id="netAmount${job.jobId}"><fmt:formatNumber value="${job.netAmount}" type="currency"/></span>
                    </div>
                    <div class="job-column actul-turned-in  date">
                        <span class="view">${job.actualTurnInDateString}</span>
                        <c:if test="${job.agencyEditable}">
                          <input class="edit date-picker" onchange="saveSelectedJob(${job.jobId},false);" type="text" name="job.actualTurnInDate"  id="actulTurnIn${job.jobId}"  value="${job.actualTurnInDateString}" readonly="readonly">
                        </c:if>
                        <c:if test="${!job.agencyEditable}">
                          <span class="edit">${job.actualTurnInDateString}</span>
                          <input style="display:none;" onchange="saveSelectedJob(${job.jobId},false);" type="text" name="job.actualTurnInDate"  id="actulTurnIn${job.jobId}"  value="${job.actualTurnInDateString}" readonly="readonly">
                        </c:if>
                    </div>
                    <div class="job-column actul-turned-in  date">
                        <span ><fmt:formatNumber value="${job.balanceDue}" type="currency"/></span>
                    </div>
                  </div>
                  <div class="job-row">
                    <div class="job-column status">
                       Status : 
                    </div>
                    <div class="job-column status">
                        <span class="view">${job.status.description}</span>
                        <span  id="statusId${job.jobId}"  class="edit">${job.status.description}</span>
                    </div>
                    <div class="job-column status">  
                    </div>
                     <div class="job-column status">  
                    </div>
                     <div class="job-column status">  
                    </div>
                     <div class="job-column status">  
                    </div>
                     <div class="job-column status">  
                    </div>
                     <div class="job-column status">  
                    </div>
                    <div class="job-column status">  
                    </div>
                    <div class="job-column actions">
                       <%--<c:if test="${job.statusId < 3}">
                        <img alt="Edit" class="view edit-job job-action"  src="${pageContext.request.contextPath}/images/edit-icon.png" />
                      </c:if>
                      <c:if test="${actionBean.pendingEdit}">
                         <stripes:link href="<%=QglLogPendingAction.URL%>" class="view">
                           Back
                        </stripes:link>
                        </c:if>   
                        <c:if test="${actionBean.pendingTurnInEdit}">
                         <stripes:link href="<%=QglLogPendingTurnedInAction.URL%>" class="view">
                            Back
                        </stripes:link>
                        </c:if>
                        <c:if test="${actionBean.detailEdit}">
                         <stripes:link href="<%=QglLogDetailAction.URL%>" class="view">
                            Back
                        </stripes:link>
                        </c:if>--%>
                        
                        
						
						<!-- <a> <img class="view detail-job job-action" src="${pageContext.request.contextPath}/images/detail-icon.png" /></a>
						<a href="javascript:{}" class="view edit-job job-action">Edit </a>-->
						 <div>
						    <c:if test="${job.agencyEditable || job.scopistEditable || job.prooferEditable}">
						    
							  <a href="javascript:{}" class="view edit-job job-action" style="margin-right: 20px;">Edit </a>
							
							
							</c:if> 
							<c:if test="${actionBean.pendingEdit}">
							
                               <stripes:link href="<%=QglLogPendingAction.URL%>" class="view">
                                     Back
                               </stripes:link>
							
							</c:if>
							<c:if test="${actionBean.pendingTurnInEdit}">
							
                               <stripes:link href="<%=QglLogPendingTurnedInAction.URL%>" class="view">
                                   Back
                               </stripes:link>
							
							</c:if>
							<c:if test="${actionBean.detailEdit}">
							
                               <stripes:link href="<%=QglLogDetailAction.URL%>" class="view">
                                   Back
                               </stripes:link>
							
							</c:if>  
							
							</div>
						
						 <span class="edit cancel-edit job-action" > (X)</span>
                         <input class="edit job-action" type="submit" name="saveJob"  value="save"  src="${pageContext.request.contextPath}/images/save.gif" title="<fmt:message bundle='${help}' key='help.qgl.SAVE'/>">  
                    </div>
                    
                  </div>
				  			     <input type="hidden" id="jobId${job.jobId}" class="jobId" name="jobId" value="${job.jobId}"/>

                <c:set var="jobIndex" value="${jobStatus.index + 1}"/>
				 <input type="hidden" class="selectedjobid jobId" value="${job.jobId}" />
               </form>
               
               <div class="processImage"></div>
            </c:forEach>
            <div id="paginationDiv"></div>
    </div>
</div>
<div id="save-or-discard"></div>

<!-- Begin InformationText -->
<div style="overflow:hidden;height:78%;display: none;" id="infoContainer">
  <div id="infoContent" class="infoContentContainer">
    <div style="text-align:right;padding:0px;margin:0px;margin-top:-5px;"><img src="images/delete-icon.gif" width="16" height="16" alt="Close" id="infoclose" style="cursor:pointer;"/></div>
    
    	<div class="insContent" style="height:430px;">
  <p>Accounting  based on QGL calculations are shown  in this detail accounting.  Amounts  cannot be edited from this tab, as the information is calculated based on  chosen codes for A/R and A/P</p>
  <p> <strong>TOTAL A/R</strong> is the total due from the agency  for all reimbursed services </p>
  <p> <strong>TOTAL A/P</strong> is the total due to scopist  and/or proofreader </p>
  <p><strong>TOTAL NET</strong> is the total of A/R Net minus  A/P Net </p>
    <p><strong>BAL DUE </strong> is A/R Net Balance due and will show as 0.00  (zero) until the invoice is generated and posted, and QGL will keep an updated  running total of what is DUE to you based on applied payments.</p>
  <p>The far right column is to show  you how much time you spend and can save by delegating to others.  It’s a write-off expense and QGL keeps track  of total paid to each accounts payable, making 1099 calculations easy for tax  preparation.  <span style="font-family:algerian,arial">QUICK GLANCE LOG </span>gives you more time  for you to enjoy life.  
  <p>Taking one or more days off to  scope or proof, you’re losing money; whereas, delegating work to a scopist or  proofreader and reporting allows you to pay for those services.  </p>
  <h3>RATE TABLE</h3>
  <p><strong>UNDERSTANDING THE PER-UNIT MEANING</strong></p>
    <p> <strong>ACTUAL</strong> - This is calculated based on  the <strong>TYPE</strong> and on the actual  pages entered in <strong>ACTUAL</strong> pages.  This would apply to Original, Original +  certified copies (i.e., actual final total pages), and single-service billing (i.e.,  cancellation, reporter’s affidavit, minimum transcript = enter the number  1).  </p>
   <p>  <strong>NOTE:  Only one Type can be chosen; all other  services/expenses are captured under another field.</strong></p>
     <p><strong>HOUR – </strong>This is calculated based on  per-hour amount.</p>
     <p><strong>PAGE-</strong>This is calculated based on  per-page amount</p>
     <p><strong>EVENT</strong> –This is calculated on the  one-time event amount</p>
     <p><strong>PER DIEM – </strong>This is calculated on a  per-diem amount</p>
     <p><strong>COST – </strong>This is the actual cost/receipt  for expense</p>
   <p><strong>CODE – </strong>This is <strong>QGL-calculated</strong> based on  TYPE or other service/expense chosen for the job</p>


</div>
</div>
  <div style="float:right;color:#FFF;"><a href="#" id="slidebutton1"><img src="images/infoicon.png"  alt="Information" border="0" /></a></div>
  
</div>
 <!-- End InformationText -->   

<script>


var agyIntlsArray = new Array();
var prfIntlsArray = new Array();
var scpIntlsArray = new Array();

scopist();
function scopist(){
	 <c:forEach items="${actionBean.scopistInitialsList}" var="scpIntls" varStatus="loop">
		scpIntlsArray.push('${scpIntls.initial}');	 
    </c:forEach>
    
    
	
}

proofer();

function proofer(){
	
	 <c:forEach items="${actionBean.prooferInitialsList}" var="prfIntls" varStatus="loop">
		prfIntlsArray.push('${prfIntls.initial}');			 
     </c:forEach>


}

agency();

function agency(){
	<c:forEach items="${actionBean.agencyInitialsList}" var="agyIntls" varStatus="loop">
	agyIntlsArray.push('${agyIntls.initial}');			 
</c:forEach>

	
}

</script> 
<style>

.toolTip-cust{position:relative;height:auto;}
.toolTip-cust span{
    display:none; position:absolute;
    top:-68px; left:-75px; width:14em;
	font:10px;
   background: rgb(254,252,234); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(254,252,234,1) 0%, rgba(241,218,54,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,252,234,1)), color-stop(100%,rgba(241,218,54,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */

    color: #000;
    text-shadow: 0 1px 0 #fff;
	padding:5px;
	border-radius:5px;
	text-align:center;
	border:1px solid #578EB8;
	z-index:99999999999;
	height:45px;
    
}

.ketchup-errorPar{position:relative;}
.ketchup-errorPar .ketchup-error{position:absolute;left: 47px;
    top: -61px;
    width: 100px;}

.toolTip-cust span:after{content:"";border:5px solid transparent;border-top:5px solid #578EB8;top:100%;position:absolute;left:45%;}

.toolTip-cust:focus span,.toolTip-cust:hover span{display:block;
   }
   
.profile-block table tr:first-child td:first-child .toolTip-cust span{top:-172px;}
.profile-block table tr:first-child td:nth-child(3) .toolTip-cust span{top:-204px;}
.profile-buttons .toolTip-cust span{width:8em;height:75px;left:-88px;top:-73px;}

.dd_menu {padding:0px; margin:0; list-style-type:none;}
.dd_menu li {float:left; border-right: solid 1px white;display:inline;}
.dd_menu li a {padding:0px 20px; display:block; color:#fff; text-decoration:none; font:12px arial, verdana, sans-serif; font-weight: bold;}
.dd_menu li:hover a {text-decoration:underline;}

.dd_menu ul {position:absolute; left:-9999px; top:-9999px; list-style-type:none;}
.dd_menu li:hover {position:relative; background:none;}
.dd_menu li:hover ul {left:-25px; top:15px; background:lavender; padding:3px; border:1px solid grey; width:auto;}
.dd_menu li:hover ul li {border:none;}
.dd_menu li:hover ul li a {height:18px; padding:5px 0px; display:block; font-size:11px; width:140px; line-height:18px; text-indent:5px; color:#444; background-color:lavender; text-decoration:none; border:1px solid transparent;}
.dd_menu li:hover ul li a:hover {height:18px; background:silver; color:#000; border:solid 1px #444;}


#agencyStyle label{width:100px;display:block; float:left;text-align:center;margin-left:12px;margin-right:12px;}
#agencyStyle input{width:100px;margin-left:10px;margin-right:10px;margin-top:10px;}

#agency-rate-item-perunit-expedite{display:none;}
#agency-cc-rate-item-perunit-expedite{display:none;}

#agency-rate-item-unit,#agency-rate-item-perunit,#agency-cc-rate-item-unit,#agency-cc-rate-item-perunit,#agency-cc-rate-item-perunit-expedite,#agency-rate-item-perunit-expedite{width:100px;margin-left:10px;margin-right:10px;margin-top:10px;}
.proofer h4,.scopist h4,.agency h4{border-radius:5px;margin:5px;}
.proofer .toolTip-caption,.agency .toolTip-caption,.scopist .toolTip-caption {height:70px;top:-100px;}
.agency .toolTip-caption {left:-47px;}
#masterTableInnerDiv select {width: 75px;}
.reimjobrateitemperunit {width: 75px;}
.reimjobrateitemrateunit {width: 75px;}
.label{width:75px;display:inline-table;}

#rateItemCode .inputs, .input-value {width: 85%;}
#rateItemCode input[type="text"] {border-radius: 5px 5px 5px 5px;}
#modalratetable .code-name, #modalratetable .code-name:focus, #modalratetable .code-name:hover {
    background: none repeat scroll 0 0 #DDDDDD;
    color: black;
}
.ui-dialog-content .inputs, select {border: 1px solid #D4D4D4;padding: 3px;}
.input-desc {width: 95%;}
table select {width: 100%;}
</style>